@charset "UTF-8";
html {
    font-size: 20px;
}
/*移动端样式*/
@media (max-width:1242px){
	/*第一屏*/
	.dyp{
		width:100%;
		height:100vh;
		position:fixed;
		left:0;
		top:0;
		background:url(../images/52.png) no-repeat;
		background-size:100%;
		z-index:102;
		#jqmeter-container{
			margin-top:106%;
			display:flex;
			justify-content:center;
			.inner-therm{
				display:flex;
				justify-content:center;
			}
		}
	}
	/*介绍页面 */
	.jianjie{
		width:100%;
		height:100vh;
		background:url(../images/22.png) no-repeat;
		background-size:100%;
		position:absolute;
		left:0;
		top:0;
		display:none;
		z-index: 101;
		.dianji{
			width:3.712rem;
			height:3.712rem;
			background:url(../images/917.png) no-repeat;
			background-size:100%;
			position: absolute;
		    left: 12rem;
		    bottom: 1rem;
		    animation: bounce-down 1.5s linear infinite;
		}
	}
	/*点击开始游戏*/
	.begin{
		width:100%;
		height:100vh;
		position:relative;
		display:none;
		background:url(../images/601.png) no-repeat;
		background-size:100%;
		overflow: hidden;
		.qiao{
			position:absolute;
			left:0;
			top:14rem;
			width:100%;
			height:10.048rem;
			background:url(../images/47.png) no-repeat;
			background-size:100%;
			z-index: 2;
		}
		.click{
			width:5.7387rem;
			height:1.8613rem;
			color:#fff;
			background:red;
			text-align:center;
			position:absolute;
			background:url(../images/43.png) no-repeat;
			background-size:100%;
			left:32%;
			bottom:5%;
			z-index: 3;
			.shou{
				width: 1.9627rem;
    			height: 3.0027rem;
				background: url(../images/51.png) no-repeat;
				background-size: 100%;
				position: absolute;
				right: 2rem;
    			top: -2.5rem;
				-webkit-animation: bounce-down 1.5s linear infinite;
			    animation: bounce-down 1.5s linear infinite;
			}
		}
		#move1{
			left:0;
			top:9.7rem;
			z-index:1;
			img{
				width:2.84rem;
			}
		}
	}
	/*$('#box').animate({left:'-11.3067rem'},3000);*/
	/*场景*/
	.boxs{
		width:100%;
		height:100vh;
		position:relative;
		display:none;
		overflow:hidden;
		
		#box{
			width:27.3067rem;
			height:41.8133rem;
			position:absolute;
			left:0;
			bottom:0;
			z-index: 1;
			.fumian1{
				width: 13.76rem;
			    height: 5.5893rem;
			    background: url(../images/29.png) no-repeat;
			    background-size: 100%;
			    position: absolute;
			    left: -0.8rem;
			    top: 32rem;
			    z-index: 120;
			}
			.fumian2{
				    width: 7.7227rem;
				    height: 7.104rem;
				    background: url(../images/28.png) no-repeat;
				    background-size: 100%;
				    position: absolute;
				    left: 19.2rem;
				    top: 9.8rem;
				    z-index: 120;
			}
			.ztbg{
				width:27.3067rem;
				height:41.8133rem;
				position:absolute;
				left:0;
				bottom:0;
			}
			#move_div{
				left:0;
				top:27.8rem;
				img{
					width:2.84rem;
				}
			}
		}
		.box{
			width:100%;
			height:100vh;
	        position:absolute;
	        left:0;
	        bottom:0;
	        z-index: 2;
			.jsbox{
				width:80%;
				height:1.0667rem;
				position: absolute;
			    left: 2%;
			    top: 2%;
				.jindubox{
					width: 80%;
				    height: 2.0667rem;
				    background: url(../images/20.png) no-repeat;
				    background-size: 100%;
				    padding-left: 1.46rem;
					.jindu{
						width:0;
						height: 0.6667rem;
					    background: white;
					    border-radius: 0 26.4267rem 26.4267rem 0;
					    margin-top: 0.4rem;
					}
				}
				span{
					width:20%;
					line-height:1.0667rem;
					text-align:center;
				}
			}
			/*掷色子*/
			#main{
				display:none;
				.demo{
					width:100%; 
					height:2.56rem; 
					margin:0.2133rem auto;
					.wrap{
						width:1.92rem; 
						height:6rem; 
						margin:2.56rem auto 0.64rem auto; 
						position:relative
					}
					.dice{
						width:4.6rem; 
						height:4rem; 
						background:url(../images/dice.png) no-repeat; 
						cursor:pointer;
					}
					.dice_1{
						background-position:-5px -4px;
					}
					.dice_2{
						background-position:-5px -107px;
					}
		        	.dice_3{
		        		background-position:-5px -212px;
		        	}
		        	.dice_4{
		        		background-position:-5px -317px;
		        	}
		        	.dice_5{
		        		background-position:-5px -427px;
		        	}
		        	.dice_6{
		        		background-position:-5px -535px;
		        	}
		        	.dice_t{
		        		background-position:-5px -651px;
		        	}
		        	.dice_s{
		        		background-position:-5px -763px;
		        	}
		        	.dice_e{
		        		background-position:-5px -876px;
		        	}
		        	#result{
		        		text-align:center; 
		        		font-size:16px
		        	}
		        	span{
		        		font-weight:bold; 
		        		color:#f30; 
		        		margin:6px
		        	}
		        	#dice_mask{
		        		width:90px;
		        		height:90px;
		        		background:#fff; 
		        		opacity:0; 
		        		position:absolute; 
		        		top:0; 
		        		left:0; 
		        		z-index:999;
		        	}
				}
			}
			
			/*音乐*/
			.audio_div { 
				width:1.28rem;
				height:1.28rem;
				background: url('images/music_on.png') no-repeat 0 0; 
				-webkit-animation: rotating 1.2s linear infinite; 
				animation: rotating 1.2s linear infinite;
				position:absolute;
				right:0.4267rem;
				top:0.4267rem;
			}
			/*小人*/
			.go{
				width:5.44rem;
				height:6.8267rem;
				background:red;
				color:#fff;
				position:absolute;
				right:0;
				bottom:0;
				background:url(../images/19.png) no-repeat;
				background-size:100%;
				.shou{
					width: 1.9627rem;
	    			height: 3.0027rem;
					background: url(../images/51.png) no-repeat;
					background-size: 100%;
					position: absolute;
					right: 1rem;
    				top: 0.5rem;
					-webkit-animation: bounce-down 1.5s linear infinite;
				    animation: bounce-down 1.5s linear infinite;
				}
			}
			/*题目*/
			.tmbox{
				width:100%;
				height:100vh;
				background:rgba(0,0,0,0.5);
				display:none;
				position: absolute;
			    left: 0;
			    top: 0;
				.topic{
					width:14.656rem;
					height:0;
					position:absolute;
					left: 5%;
	    			top: 15%;
		    		display:none;
		    		overflow:hidden;
					.topic-li{
						width:100%;
						height:100%;
						    padding-top: 11.2rem;
						
						div{
							width: 62%;
						    height: 0.6693rem;
						    position: relative;
						    margin: 0 auto;
						    margin-bottom: 0.6053rem;
							span{
								width: 0.6693rem;
							    height: 0.6693rem;
							    position: absolute;
							    left: 0.8533rem;
							    top: 0;

							}
						}
					}
				}
			}
		}	
	}
	/*闯关结果*/
	.jieguo{
		width:100%;
		height:100vh;
		position:absolute;
		left:0;
		top:0;
		/*background:url(../images/16.png) no-repeat;*/

		display:none;
		z-index:3;
		.fenshus{
			position:absolute;
			height:2.8587rem;
			left: 8.8rem;
 			top: 9.4rem;
		}
		.zlyc{
			width:5.4827rem;
			height:1.216rem;
			background:url(../images/18.png) no-repeat;
			background-size:100%;
			position:absolute;
			left:7.8933rem;
			top:17.7067rem;
			a{
				display:block;
				width:100%;
				height:100%;
			}
		}

	}
	
}
/*PC端样式*/
@media (min-width: 1242px){
	.dyp{
		display:none;
	}
	.box{
		width:760px;
		height:100vh;
		border:0.0213rem solid red;
		margin:0 auto;
		position:relative;
		display:none;
		/*掷色子*/
		/*.demo{
			width:760px; 
			height:120px; 
			margin:10px auto;
			.wrap{
	        	width:90px; 
	        	height:90px; 
	        	margin:120px auto 30px auto; 
	        	position:relative;
	        }
	        .dice{
	        	width:90px;
	        	height:90px;
	        	background:url(../images/dice.png) no-repeat; 
	         	cursor:pointer;
	    	}
	        .dice_1{
	        	background-position:-5px -4px;
	        }
	        .dice_2{
	        	background-position:-5px -107px;
	        }
	        .dice_3{
	        	background-position:-5px -212px;
	        }
	        .dice_4{
	        	background-position:-5px -317px;
	        }
	        .dice_5{
	        	background-position:-5px -427px;
	        }
	        .dice_6{
	        	background-position:-5px -535px;
	        }
	        .dice_t{
	        	background-position:-5px -651px;
	        }
	        .dice_s{
	        	background-position:-5px -763px;
	        }
	        .dice_e{
	        	background-position:-5px -876px;
	        }
	        #result{
	        	text-align:center; 
	        	font-size:16px;
	        }
	       span{
	        	font-weight:bold; 
	        	color:#f30; 
	        	margin:6px;
	        }
	        #dice_mask{
	        	width:90px; 
	        	height:90px;
	        	background:#fff; 
	        	opacity:0; 
	        	position:absolute; 
	        	top:0; 
	        	left:0; 
	        	z-index:999;
	        }
		}*/
		/*音乐*/
		/*.audio_div { 
			width:1.0667rem;
			height:1.0667rem;
			background: url('images/music_on.png') no-repeat 0 0; 
			background-size:100%;
			-webkit-animation: rotating 1.2s linear infinite; 
			animation: rotating 1.2s linear infinite;
			position:absolute;
			top:20px;
			right:20px;
		}*/
		/*小人*/
		/*.go{
			position:absolute;
			right:20px;
			bottom:20px;
			width:50px;
			height:50px;
			background:red;
			color:#fff;
		}
		#box{
			#move_div{
				position:absolute;
				left:0px;
				top:300px;
				height:111px; 
				width: 55px;
			}
		}*/
	}
	.jianjie{
		display:none;
	}
	.begin{
		display:none;
	}
	.boxs{
		display:none;
	}
	.jieguo{
		display:none;
	}
}